<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>签到信息页面</title>
<link rel="stylesheet" href="layui/css/layui.css" media="all">


<style>
.layui-btn:not(.layui-btn-lg ):not(.layui-btn-sm):not(.layui-btn-xs) {
	height: 34px;
	line-height: 34px;
	padding: 0 8px;
}
</style>
</head>
<body>
	<div class="layuimini-container">
		<div class="layuimini-main">
			<div class="layui-form" style="margin-top: 20px;" onsubmit="false">
				<div class="layui-form-item">
					<label class="layui-form-label">用户名:</label>
					<div class="layui-input-inline">
						<input type="text" name="username" id="username"
							placeholder="请输入用户名" class="layui-input">
					</div>
					
						<div  id="signtime">
							<label class="layui-form-label">签到时间:</label>
							<div class="layui-input-inline" style="width: 150px;">
								<input type="text" name="signtime_min" id="signtime_min"
									placeholder="起始时间" autocomplete="off" class="layui-input">
							</div>
							<div class="layui-form-mid">-</div>
							<div class="layui-input-inline" style="width: 150px;">
								<input type="text" name="signtime_max" id="signtime_max"
									placeholder="结束时间" autocomplete="off" class="layui-input">
							</div>
						</div>
					
						<label class="layui-form-label">签到状态:</label>
						<div class="layui-input-inline" style="width: 120;">
							<select name="signstate" id="signstate" class="layui-input">
								<option value="">请选择状态</option>
								<option value="1">已签到</option>
								<option value="2">未签到</option>
							</select>
						
					</div>
					<button class="layui-btn" id="search" data-type="reload">搜索</button>
				</div>
				
			</div>
			<div>
				<table class="layui-hide" id="test" lay-filter="test"></table>
			</div>
		</div>
	</div>


	<!-- 操作列 -->
	<script type="text/html" id="barDemo">
			<a class="layui-btn layui-btn-xs" lay-event="editsign">编辑</a>
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delsign">删除</a>
		</script>
	<script type="text/html" id="toolbarDemo">
      <!--表头上面引入了一个添加签到的操作-->
      <div class="layui-btn-container">
      </div>
    </script>
	<script src="layui/layui.js" charset="utf-8"></script>
	<script src="js/Global.js" type="text/javascript" charset="utf-8"></script>

	<script type="text/html" id="signstateqiandaozhuangtai">
      {{#  if(d.signstate == 1){ }}
          <span style="color: #F581B1;">已签到</span>
      {{#  } else if(d.signstate == 2){ }}
          <span style="color: #1e9fff;">已签退</span>
      {{#  } }}
         </script>
	<script>
		     layui.use([ 'form', 'table', 'laydate' ],
						function() { //如果只加载一个模块，可以不填数组。如：layui.use('form')
							form = layui.form, table = layui.table;//获取table模块
							var laydate = layui.laydate;
							var $ = layui.jquery;// $ = layui.$
							//执行一个laydate实例
							laydate.render({
								elem : '#signtime', //指定元素
								type : 'datetime',
								theme: 'molv',
								trigger : 'click', //采用click弹出
								calendar : true, //允许显示公历节日
								range : [ '#signtime_min', '#signtime_max' ]
							});
							// 渲染表格
							table
									.render({
										elem : '#test',
										url : globalData.server
												+ 'public/getAllSign',
										toolbar : '#toolbarDemo', //开启头部工具栏
										where : {
											method : 'getAll',
											signname : ''
										},
										method : 'POST',
										cols : [ [
												{
													field : 'signid',
													title : '签到ID',
													fixed : 'left',
													align : 'center',
													sort : true,
													width : 100,
												},
												{
													field : 'username',
													title : '用户姓名',
													align : 'center',
													width : 100,
												},
												{
													field : 'signstate',
													title : '签到状态',
													templet : '#signstateqiandaozhuangtai',
													align : 'center',
													width : 100,
												},
												{
													field : 'signtime',
													title : '签到时间',
													templet : "<div>{{!d.signtime?'':layui.util.toDateString(d.signtime, 'yyyy-MM-dd HH:mm:ss')}}</div>",
													align : 'center',
													width : 170,
												},
												{
													field : 'signouttime',
													title : '签退时间',
													templet : "<div>{{!d.signouttime?'':layui.util.toDateString(d.signouttime, 'yyyy-MM-dd HH:mm:ss')}}</div>",
													align : 'center',
													width : 170,
												}, {
													field : 'weight',
													title : '权重排序',
													sort : true,
													align : 'center',
													width : 120,
												}, {
													field : 'message',
													title : '备注',
													align : 'center',
													width : 150,
												}, {
													title : '操作',
													fixed : 'right',
													align : 'center',
													toolbar : '#barDemo',
													width : 180
												} ] ],
										id : 'testReload',
										page : true
									});

							$('#search').on(
									'click',
									function() {
										/* var signstate = $("#signstate").val(); */
										table.reload('testReload', {
											where : {
												'signstate' : $("#signstate").val(),
												'username' : $("#username").val(),
												'signtime_min' : $("#signtime_min").val(),
												'signtime_max' : $("#signtime_max").val()
											}
										});
									});
							//监听提交按钮
							table.on('tool(test)', function(obj) {
								var data = obj.data;
								if (obj.event === 'delsign'){
					                layer.confirm('真的删除 '+ data.username +' 的签到信息吗?', function(index) {
										$.post(globalData.server+ 'public/deleteSign', {
											"signid" : data.signid
										}, function(res) {
											if(res.data) {
												layer.msg("删除成功", {
													icon: 1,
													time: 3000
												});
												obj.del();
												window.location.reload();
											} else {
												layer.msg("删除失败", {
													icon: 2,
													time: 3000
												})
											}
										}, "json");
										obj.del();
										layer.close(index);
									});
					            }else if (obj.event === 'editsign') {
									//prompt层==========>
									layer.prompt({
										title: '进行修改 ' + data.username + ' 的权重：',
										value: data.weight,
										formType: 0
									}, function(pass, index) {
										if(/^\d+$/.test(pass)){
									      	$.post(globalData.server+ 'public/updateSign', {
												"signid": data.signid,
												"weight": pass
											}, function(data) {
												if(data.count > 0) {
													layer.msg("修改成功", {
														icon: 1,
														time: 3000
													});
												} else {
													layer.msg("修改失败", {
														icon: 2,
														time: 3000
													})
												}
											}, "json");
											window.location.reload();
											layer.close(index);
								    	}else{
								    		layer.msg("请输入数字");
								    	}
									});
			            }  else if (obj.event === 'setsignmenus') {
									var index = layer.open({
										title : '给' + data.signname + '设置菜单栏',
										type : 2,
										shade : 0.2,
										maxmin : true,
										shadeClose : true,
										area : [ '100%', '100%' ],
										content : 'Setsignmenus.html',
										success : function(layero, index) {
											var body = layer.getChildFrame('body', index);
											body.find("#signid").val(data.signid);
										},
										end : function() {
											window.location.reload();
										}
									});
									$(window).on("resize", function() {
										layer.full(index);
									});
								} else if (obj.event === 'mod') {
									layer.open({
										type : 2, //打开iframe
										title : "选择模块",
										area : [ '100%', '100%' ],
										content : "treestat.html",
										success : function(layero, index) {
											var body = layer.getChildFrame('body', index);
											body.find("#signid").val(data.signid);
										},
										end : function() {
											window.location.reload();
										}
									});
								}

							});
							table.on('toolbar(test)', function(obj) {
								switch (obj.event) {
								case 'addsign':
									layer.open({
										type : 2,
										area : [ '550px', '300px' ], //页面的宽高
										content : 'sign_add.html',
										title : '添加签到信息',
										fix : false,
										maxmin : true,
										end : function() {
											window.location.reload();
										}
									});
									break;
								}
								;
							});
						});
	</script>

</body>
</html>